<template>
<el-tabs class="notice-index" v-model="type">
    <el-tab-pane class="scroll-bar" v-for="(item, i) in tabs" :key="i" :label="item" :name="`${i}`">
        <component v-if="type===`${i}`" :is="componentId[type]"></component>
    </el-tab-pane>
</el-tabs>
</template>

<script>
import NoticeList from './NoticeList'
import ProgressList from './ProgressList'
export default {
    name: 'NoticeCenter',
    components: { NoticeList, ProgressList },
    data () {
        return {
            type: '0',
            tabs: ['消息', '进度'],
            componentId: ['notice-list', 'progress-list']
        }
    },
    created () {
        this.init()
    },
    methods: {
        init () {}
    }
}
</script>
<style lang="less">
    .notice-index {
        .scroll-bar {
            height: 300px;
        }
    }
</style>
